@autocompleteCls: ~"@{prefix}autocomplete";
@autocompleteClsItem: ~"@{autocompleteCls}-item";
@autocompleteClsGroup: ~"@{autocompleteCls}-group";
.@{autocompleteCls} {
  .@{autocompleteCls} {
    &-show{
      min-height: @input-height;
      display: flex;
      flex-wrap: wrap;
      .h-func-border-input();
      padding-right: 20px;
      // display: inline-block;
      .@{prefix}icon-loading{
        color: @dark4-color;
      }
      .@{prefix}icon-loading, >.@{prefix}icon-close{
        .h-func-input-right-icon();
      }

      >span{
        .h-func-tag-span();
      }
    }
    
    &-input{
      .h-func-border-input-inside-input();
    }
  }

  &-disabled{
    .@{autocompleteCls}-show{
      .h-func-border-input-disabled();
    }
  }
  &-ul {
    .h-func-list-style();
  }

}

.@{autocompleteCls}-group {
  outline: none;
  user-select: none;
  position: relative;
  font-size: @font-size-mini;
  background-color: @white-color;
  padding: 5px 0px;
  max-height: 300px;
  overflow-y: auto;
  .@{autocompleteClsItem} {
    .h-func-li-hover();
    padding: 8px 10px;
    position: relative;
    &.@{autocompleteClsItem}-selected {
      background-color: @hover-background-color;
    }
  }
  .@{autocompleteCls}-empty-content {
    color: @dark4-color;
    text-align: center;
  }
}